*{
    margin: 0;
    padding: 0;
}
$designWidth:375;
$designHeight:667;
@function vw($px){
    @return ($px/$designWidth) * 100vw;
}
@function vh($px){
    @return ($px/$designHeight) * 100vh;
}

.jjtmayapp{
    width: 100vw;
    min-height: 100vh;
    background-image: url("../../staticfile/myappbac.jpg");
    background-size: 100% 100%;
    padding: vw(15) vw(15);
    box-sizing: border-box;
    background-color: #F7F7F7;
    
    .jjtmayapptitle{
        display: flex;
        justify-content: space-between;
        color: white;
        height: 5vh;
        line-height: 5vh;
        .jjtmayapptitleleft{
            font-size: 20px;
        }
        .jjtmayapptitleright{
            font-size: 20px;
        }
    }
    .jjtmayappuser{
        // width: 100vw;
        height: 13vh;
        background: #FFFFFF;
        margin-top: 10px;
        border-radius: 15px;
        padding: 0 vw(15);
        box-sizing: border-box;
        display: flex;
        .jjtmayappuserleft{
            width: 20%;
            height: 100%;
            display: flex;
            align-items: center;
            img{
                width: vw(60);
                height: vw(60);
                border-radius: 50%;
            }
        }
        .jjtmayappusermid{
            padding: vw(12);
            width: 50%;
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            .jjtmayappusername{
                width: 100%;
                font-size: 18px;
            }
            .jjtmayappuserid{
                width: 100%;
                font-size: 14px;
                color: gray;
            }
        }
        .jjtmayappuserright{
            width: 30%;
            display: flex;
            align-items: center;
            justify-content: right;
            .jjtmayappuserarrow{
                transform: rotate(180deg);
                font-size: 20px;
                color: gray;
            }
        }
    }
    .jjtmayappstate{
        height: 13vh;
        background: #FFFFFF;
        margin-top: 10px;
        border-radius: 20px;
        box-sizing: border-box;
        display: flex;
        font-size: 14px;
        div{
            width: 33vw;
            height: 100%;
            text-align: center;
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            padding: 15px;
            box-sizing: border-box;
            .jjtmayappstatep{
                font-size: 20px;
                font-weight: 500;
            }
            p{
                width: 100%;
            }
        }

    }
    .jjtmayappcon{
        height: 44vh;
        background: #FFFFFF;
        margin-top: 10px;
        border-radius: 15px;
        box-sizing: border-box;
        padding: 0 vw(15);
        font-size: 14px;
        .jjtmayappcondetail{
            border-bottom: 3px solid #F7F7F7;
            box-sizing: border-box;
            display: flex;
            .jjtmayappcondetail1{
                width: 10%;
                height: 7vh;
                line-height: 7vh;
                // background: red

            }
            .jjtmayappcondetail2{
                width: 30%;
                height: 7vh;
                line-height: 7vh;
                // background: red

            }
            .jjtmayappcondetail3{
                width: 60%;
                text-align: right;
                height: 7vh;
                line-height: 7vh;
                // background: red;
                .jjtmayappuserarrow{
                    transform: rotate(180deg);
                    // font-size: 20px;
                }
            }
        }
    }
}
.rv-share-sheet__option{
    
    .rv-share-sheet__name{
        // margin-left: 0px!important;
    }
}